<!--
 * @Author: fengweicong 75202172+fengweicong@users.noreply.github.com
 * @Date: 2022-02-16 16:53:19
 * @LastEditors: fengweicong 75202172+fengweicong@users.noreply.github.com
 * @LastEditTime: 2022-07-14 09:43:52
 * @FilePath: \B2B\ebuy\src\views\Main\Supplier\supplier\Products\supplyProduct.vue
 * @Description: 
 * 
 * Copyright (c) 2022 by fengweicong 75202172+fengweicong@users.noreply.github.com, All Rights Reserved. 
-->
<template>
    <div id="supplyProduct">
        <div class="image">
            <img v-lazy="product.photo_url">
        </div>
        <div class="info">
            <div class="content-block">
                <div class="info1">
                    <!-- <span class="">{{product.price}}元/斤</span> -->
                    <!-- <span class="right">成交{{product.bargin_amount}}元</span> -->
                </div>
                <div class="name">
                    <span>{{product.product_name}}</span>
                </div>
                <div class="bottom">
                    <div class="supplement-block">
                        <!-- <div>{{product.delivery_time}}小时发货</div> -->
                        <div>{{product.introduction}}</div>
                    </div>
                </div>          
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name:'supplyProduct',
    props:{
        product:Object
    }
}
</script>

<style lang="less" scoped>
#supplyProduct:hover{
    border: solid 2px #67C23C;
}
#supplyProduct{
    width: 220px;
    height: 400px;
    border: solid 2px #f5f5f5; 
    box-shadow: 10px 10px 12px 0 rgb(0 0 0 / 10%);
    .image{
        width: 100%;
        height: 220px;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .info{
        width: 100%;
        height: 100px;
    }
    .content-block{
        width: 90%;
        margin: 0 auto;
        .info1{
            height: 40px;
            span{
                line-height: 40px;
            }    
            .right{
                float: right;
            }
        }
        .name{
            width: 100%;
            span{
                line-height: 30px;
                text-align: center;
            }
        }
        .bottom{
            width: 100%;
            height: 40px;
            margin-top: 10px;
            .supplement-block{
                width: 100px;
                // border: solid 2px #67C23C;
                background-color: #5bf115;
                color: white;
            }
        }
    }
}

</style>